<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6"><![endif]-->
<!--[if IE 7 ]><html class="ie ie7"><![endif]-->
<!--[if IE 8 ]><html class="ie ie8"><![endif]-->
<!--[if IE 9 ]><html class="ie ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html><!--<![endif]-->
<head>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="initial-scale=1,minimum-scale=1" />
	<title>活动管理-活动报名信息</title>
	<%@include file="/public/head-tag.jsp" %>
	<style>
	.item-toolbar{padding:5px;}
	.toolbar-title{font-size:14px}
	</style>
</head>
<body>
     <%@include file="/public/header.jsp" %>
    
    <section class="container">
		<c:set var="sidebar" scope="request" value="content"/>
		    <c:set var="navbar" scope="request" value="activity"/>
		    <c:import url="/public/sidebar.jsp"/>
    	<div class="content">
    		<div class="content-top">
    			<h3 class="content-title">
    				 <div class="bread">
    					<a href="/Manager/web/action/listPage">活动管理</a>
    					<span>&gt;</span>
    					<span>活动报名信息</span>
    				</div>
    			</h3>
    				
    		</div>
    		
    		<div class="content-main">
				<section class="content-item" data-template="item/list" id="box">
					<div class="content-item-top">
						<div class="item-toolbar">
							<span class="toolbar-title">${title}</span>
							<div class="fn-right">
                               <a id="exportDoc" href="/Manager/web/apply/exportExcel?id=${id}&title=${title}" data-href="/Manager/web/apply/exportExcel?id=${id}&title=${title}" target="_blank" class="btn btn-default btn-medium">导出excel</a>    			  
                            </div>
						</div> 
						<form action="/Manager/web/vote/apply/exportSearch" method="get" autocomplete="off">
							
							<div class="filter-item">
								<label for="">时间</label>
								<input type="text" class="text text-100" placeholder="开始时间" name="sdate" date-range/>
								<span>至</span>
								<input type="text" class="text text-100" placeholder="结束时间"  name="edate" date-range/>
							</div>
                            <div class="filter-item">
								<label for="">选手状态</label>
								<select name="status" class="select">
									<option value="">所有</option>
									<option value="1">正常参选</option>
									<option value="0">不符合要求</option>
								</select>
							</div>
							<div class="filter-item">
								<label for="">排序条件</label>
								<select name="order" class="select">
								    <option value="applyId">默认为报名序号</option>
									<option value="applyId">报名序号</option>
									<option value="item06">总票数</option>
									<option value="applyTime">报名时间</option>
								</select>
							</div>
							<div class="filter-item">
								<input type="hidden" name="page" value="1"/>
								<input type="hidden" name="id"   value="${id}"/>
							</div>
						</form>
					</div>
					
					<div class="content-item-block">
							<table class="table">
								<thead>
								<tr>
									<th style="width:10%">报名时间</th>
									<th style="width:10%">用户</th>
									<th style="width:10%">报名号</th>
									<th style="width:10%">报名信息</th>
									<th style="width:20%">报名图片</th>
									<th style="width:10%">总票数</th>
									<th style="width:10%">拉票宣言</th>
									<th style="width:10%">选手状态</th>
									<th style="width:10%">操作</th>
								</tr>
								</thead>
								<tbody id="sortable">
									<tr>
										<td class="align-center" colspan="5">
											<div class="loading">加载中...</div>
										</td>
									</tr>
								</tbody>
							</table>
					</div>
					
				</section>
    		</div>
    	</div>
    </section>
    
   <script type="text/template"  id="item/list" note="订单列表">
		{{if  !code }}
			<tr><td colspan="5" class="color-red">查询错误！</td></tr>
        {{else if code!=200}}
			<tr><td colspan="5" class="color-red">{{msg || '查询错误！'}}</td></tr>
        {{else if !data.datalist || data.datalist.length==0}}
			<tr><td colspan="5">没有记录！</td></tr>
		{{else}}
			{{each data.datalist as item}}
				<tr>
					<td>
						<p>{{item.applyTime | dateFormat:'yyyy-MM-dd'}} </p>
						<p class="value-note">{{item.applyTime | dateFormat:'HH:mm'}}</p>
					</td>
					<td><p>{{item.name}}&nbsp;</p> <p class="value-note"> {{item.applicator}} </p></td>
					<td><p>{{item.item05}}</p></td>
                    <td>{{#item | itemMatch:headlist | renderAttrList}}</td>
					<td><img src="http://radio.iwxlh.com/Manager/web/resource/download?resourceId={{item.item09}}" style=" width: 100px;  height:100px;"/></td>
                    <td><p>{{item.item06}}</p></td>
                    <td><p>{{item.item07}}</p></td>
                    <td>
						{{if item.status == 1}}
						<p>正常</p>
						{{/if}}
						{{if item.status != 1}}
						<p>选手已设为不符合活动要求</p>
						{{/if}}
					</td>
					<td>
					  <a href="javascript:;" action="item.changeState" data-params="{{item | pick:'applyId:id,status' | toJSON}}" class="action-link"> {{if item.status==1}}设为不符合活动要求 {{/if}} {{ if item.status==-1 || item.status==0}}设置为正常{{/if}}</a>
					</td>
				</tr>
			{{/each}}
		{{/if}}
    </script>

    <script type="text/template" id="item/changeItemState" note="活动上下线">
    	<form action="/Manager/web/vote/apply/update" method="post">
			<div class="align-center">确定要把该条报名信息置为<b class="state-red">{{if status==1}}无效{{else}}正常{{/if}}</b>吗？</div>
			<input type="hidden" name="applyId" value="{{id}}" />
            <input type="hidden" name="status" value="{{status}}" />
    	</form>
    </script> 
    
   <script type="text/template"  id="item/attrList" note="报名项目信息">
		<ul class="attr-list">
			{{each list as item}}
					<li>{{item.name}}:{{item.value}}</li>
			{{/each}}
		</ul>
    </script>
   <script src="/pages/assets/js/libs/LAB/LAB.js"></script>
   <script>
   		var baseUrl="/pages/assets/js/libs/";
   		$LAB.require({
   			baseUrl:baseUrl,
   			scripts:[
   				["artTemplate/artTemplate2.js","artTemplate/artTemplate.helpers.js"],
   				[ "form/jquery.formCheck.js?v=2015","form/jquery.ajaxSubmit.js","form/jquery.common.js?v=2015" ],
	   			["moment.min.js","jquery-date-range-picker/daterangepicker.css","jquery-date-range-picker/jquery.daterangepicker.js"],
	   			["pager/theme-simple.css","pager/jquery.pager.js"],
	   			[ "dialog/mui-dialog.css","dialog/dialog-plus-min.js" ]
   			]
   		},function(){
   			
    		var App={
    			alert : function(){
    				alert(arguments[0]);
    			},
    			initPlugins:function(){
    				
    				template.helper('itemMatch',function(item, headers){
    					var list=[];
    					$.each(headers, function(i,data){
    						list.push({
    							name:data.title,
    							value:item['item0'+i]
    						})
    					})
    					return list;
    				})
    				
    				template.helper('renderAttrList',function(list){
    					return template('item/attrList',{list:list})
    				})
    			},
    			initDatePicker:function(){
    				var $dates=$("[date-range]").dateRangePicker({
						separator : '至',
						getValue: function(){
							return '';
						},
						setValue: function(s,s1,s2){
							return false;
						}
					})
					.on("datepicker-apply",function(e,date){
						$dates.eq(0).val(date.date1.format('yyyy-MM-dd'));
						$dates.eq(1).val(date.date2.format('yyyy-MM-dd'));
						$(this).parents("form:first").submit()
					})
    			},
    			reloadItems : function() {
					$("#box").reload();
				},
    			changeItemState : function(data) {
					var id = "item/changeItemState";
					var title = "警告";
					var content = template(id, data);
					var idialog = dialog({
						id : id,
						zIndex : 5,
						width : 300,
						padding : "40px 20px",
						title : title,
						content : content,
						button : [
								{
									id : "cancel",
									value : "取消"
								},
								{
									id : "ok",
									value : "提交修改",
									autofocus : true,
									callback : function() {
										var $form = this
												.getContent()
												.find("form");
										$form
												.ajaxSubmit({
													onSuccess : function(
															result) {
														var code = result.code;
														if (code == 200) {
															idialog.remove();
															App.reloadItems();
														} else {
															var msg = result.msg
																	|| "提交失败！";
															App.alert(msg);
														}
													}
												})
										return false;
									}
								} ]
					})
					idialog.showModal();
				},
    			initEvents:function(){
    				
					$("[data-template]").ajaxLoad({
						beforeSubmit:function(){
							var $this=$(this);
							var data=$this.serialize();
							var $exportDoc=$("#exportDoc");
							$exportDoc.attr("href",$exportDoc.data("href")+data);
						},
						dataFilter:function(res){
							return res;
						}
					});
					
					$("body").on("click","[action]:not(form)",function(){
						var $this=$(this);
						var action=$this.attr("action");
						var data=$this.data("params");
						if (action == "item.changeState") {
							App.changeItemState(data);
						}
						return false;
					})
    			},
    			init : function(){
					this.initPlugins();
					this.initDatePicker();
					this.initEvents();
    			}
    		}
    		App.init();
   		})
    </script>
    </body>
</html>